<template>
  <div class="v-container">
    <v-header title="普通洗车">
      <span class="back" @click="goBack">
        <i class="el-icon-arrow-left"></i>
      </span>
    </v-header>
    <div class="mt">
      <img src="@/assets/images/xc_banner.jpg" width="100%">
      <div class="login-box">
        <div id="login-title" style="background-color: #fff;margin-top: 10px;padding:10px">
          <h3 class="h3-style" style="margin:0px 0px 0px 5px;">服务内容</h3>
        </div>

        <div
          class="login-title"
          style="background-color: #fff;border-top:1px solid #80808030;padding: 10px 15px"
        >
          <ul>
            <li>接待、全车检查、填写施工单、撤脚垫、准备工具和物品、调试洗车机压力、冲洗车身、喷洒洗车香波、擦洗车身、全车冲洗、全车吹水擦干、刷洗脚垫、擦拭车窗玻璃、全车检查、通知前台或车主、核销券码。</li>
          </ul>
        </div>

        <div id="login-title" style="background-color: #fff;margin-top: 10px;padding:10px">
          <h3 class="h3-style" style="margin:0px 0px 0px 5px;">温馨贴示</h3>
        </div>

        <div
          class="login-title"
          style="background-color: #fff;border-top:1px solid #80808030;padding: 10px 15px"
        >
          <ul>
            <li>1. 此项服务仅限星途尊享权益车辆本车使用，自线上提交、核验权益车主身份信息后的一年内，您拥有12次普通洗车服务。</li>
            <li>2. 您可通过线上（EXEED星途官方微信服务号-尊享权益兑换-验证权益人身份-点击“普通洗车”）在线兑换券码，兑换成功的服务券码可在个人中心“我的券码”中点击查看，供服务网点现场核销使用。</li>
            <li>3. 服务网点列表每日更新供在线查询，您可按需选择网点列表中的洗车网点，前往出示券码核销，使用服务。</li>
            <li>4. 为节省您的宝贵时间，我们建议您前往服务网点前致电门店预约（预约电话见线上服务网点列表）。</li>
          </ul>
        </div>

        <div class="login-title" style="margin-top:10px">
          <div class="c_select" @click="changeSelect()">
            <img v-show="!select" src="@/assets/images/4_05.png" width="25">
            <img v-show="select" src="@/assets/images/3_05.png" width="25">
          </div>
          <span @click="$router.push('/washCarTerms')">我已了解该服务流程</span>
        </div>
      </div>

      <div class="button-box" v-on:click="submit">
        <p>立即兑换</p>
      </div>
    </div>
  </div>
</template>

<script>
import vHeader from "@/components/Header.vue";
import countDown from "@/components/CountDown.vue";
import { Toast } from "mint-ui";
import { Resource } from "@/services/resource";
import LocalStorage from "@/services/storage";

export default {
  name: "login",
  components: {
    vHeader,
    countDown
  },
  props: {
    title: {
      type: String,
      default: "标题"
    }
  },
  data() {
    return {
      msg: "Footera",
      showvCode: false,
      telphone: "",
      dCode: "",
      vCode: null,
      vCodeImg: "",
      username: "",
      email: "",
      password: "",
      select: true
    };
  },
  created() {
    if(this.$route.query.select !== undefined) {
      this.select = this.$route.query.select
    }
  },
  methods: {
    // 返回上一页
    goBack() {
      this.$router.push('/mainpage')
      // this.$router.go(-1);
    },
    submit() {
      if ( !this.select) {
        Toast({
          message: "请阅读服务条款",
          position: 'middle'
        });
      } else {
        let loginStatus = LocalStorage.getLocalStorage('loginStatus');
        Resource.changeTicket
          .post({}, {  matrixContent: loginStatus })
          .then(res => {
            console.log(res);
            if (res.head.resultCode == "000000") {
              Toast({
                message: res.head.resultMsg,
                iconClass: "el-icon-success"
              });
              this.$router.push("/ticketCode");
            } else {
              Toast({
                message: res.head.resultMsg,
                position: 'middle'
              });
            }
          });
      }
    },
    changeSelect() {
      this.select = !this.select;
    }
  }
};
</script>

<style lang="less" scoped>
@import url("./style.less");
</style>
<style scoped>
li >>> .mint-field-other {
  position: static;
}
</style>